@media screen and (min-width:786px) {
    .icon {
        font-size: 2rem;
    }
    .title {
        font-size: 1.2rem;
    }
}

@media screen and (min-width: 992px) {
    .icon {
        font-size: 2.5rem;
    }
    .title {
        font-size: 1.5rem;
    }
}

@media screen and (min-width:1200px) {
    .icon {
        font-size: 2.9rem;
    }
    .title {
        font-size: 1.7rem;
    }
}

.item {
    width: 100%;
    background-color: #fff;
    box-shadow: 0px 0px 2px#c9c8c8;
    padding: 5% 0;
    border-radius: 4px;
    margin: 0 auto;
    transition: font-size 2s;
    -moz-transition: font-size 2s;
    -webkit-transition: font-size 2s;
    -o-transition: font-size 2s;
    .left {
        display: inline-block;
        width: 25%;
        text-align: center;
        font-size: 1.5rem;
        .icon {
            color: rgba(30, 99, 70, 0.616);
        }
    }
    .right {
        display: inline-block;
        font-size: 1rem;
        .title {
            color: rgba(30, 99, 70, 0.616);
            text-decoration: none;
        }
        .author {
            font-size: 0.7rem;
            margin-top: 0.8rem;
            .divs {
                display: inline-block;
                vertical-align: middle;
                >img {
                    width: 2rem;
                    height: 2rem;
                    vertical-align: middle;
                    border-radius: 50%;
                    margin-left: -0.6rem;
                    box-shadow: 0 0 2px #888888;
                }
                >img:first-child {
                    margin-left: 0;
                }
                >img:last-child {
                    margin-right: 0.8rem;
                }
            }
        }
    }
}

.item:hover {
    box-shadow: 0px 0px 5px #888888;
}